<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"
    />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="email=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="renderer" content="webkit" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <meta
      http-equiv="Cache-Control"
      content="no-cache, no-store, must-revalidate"
    />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <title>[简历]刘福-web前端开发工程师</title>
    <link
      rel="shortcut icon"
      href="assets/images/favicon.ico"
      type="image/x-icon"
    />
    <link rel="stylesheet" href="assets/css/typo.css" />
    <link rel="stylesheet" href="assets/css/font-awesome.min.css" />
    <link rel="stylesheet" href="assets/css/index.css" />
    <link
      rel="stylesheet"
      type="text/css"
      media="print"
      href="assets/css/print.css"
    />
    <script>
      function loading() {
        document.getElementsByClassName('avatar')[0].style.display = 'block';
        document.getElementsByClassName('loading')[0].style.display = 'none';
      }
    </script>
  </head>

  <body>
    <!-- <header class="header"></header> -->

    <article class="container">
      <section class="side" id="side">
        <!-- <div class="top"> -->
        <!-- 个人肖像 -->
        <section class="me">
          <section class="portrait">
            <div class="loading">
              <span></span>
              <span></span>
              <span></span>
              <span></span>
              <span></span>
            </div>
            <!-- 头像照片 -->
            <img
              class="avatar"
              src="assets/images/avatar.jpg"
              onload="loading()"
            />
            <!-- <img class="avatar" src="assets/images/avatar.jpg"> -->
          </section>
          <h1 class="name">刘福</h1>
          <h4 class="info-job">web前端开发</h4>
        </section>
        <!-- 基本信息 -->
        <section class="profile info-unit">
          <h2><i class="fa fa-user" aria-hidden="true"></i>基本信息</h2>
          <hr />
          <ul>
            <li>
              <label>个人信息</label>
              <span>刘福 · 男 · 28岁</span>
            </li>
            <li>
              <label>现居住地</label>
              <span>济南 · 历下区</span>
            </li>
          </ul>
        </section>
        <!-- </div> -->
        <!-- <div class="bom"> -->
        <!-- 联系方式 -->
        <section class="contact info-unit">
          <h2><i class="fa fa-phone" aria-hidden="true"></i>联系方式</h2>
          <hr />
          <ul>
            <li>
              <label>手机</label>
              <a href="tel:17600559935" target="_blank">17600559935(北京)</a>
            </li>
            <li>
              <label>邮箱</label>
              <a href="mailto:liufu9935@gmail.com" target="_blank"
                >liufu9935@gmail.com</a
              >
            </li>
            <li>
              <label>微信/QQ</label>
              <a href="#" target="_blank">320932011</a>
            </li>
            <li>
              <label>github</label>
              <a href="https://github.com/liufuzz" target="_blank"
                >https://github.com/liufuzz</a
              >
            </li>
          </ul>
        </section>
        <!-- 技能点 -->
        <section class="skill info-unit">
          <h2><i class="fa fa-code" aria-hidden="true"></i>技能点</h2>
          <hr />
          <ul>
            <li>
              <label>HTML</label>
              <progress value="80" max="100"></progress>
            </li>
            <li>
              <label>CSS</label>
              <progress value="70" max="100"></progress>
            </li>
            <li>
              <label>JavaScript</label>
              <progress value="75" max="100"></progress>
            </li>
            <li>
              <label>TypeScript</label>
              <progress value="70" max="100"></progress>
            </li>
            <li>
              <label>Angular</label>
              <progress value="80" max="100"></progress>
            </li>
            <li>
              <label>React</label>
              <progress value="80" max="100"></progress>
            </li>
            <li>
              <label>vue</label>
              <progress value="65" max="100"></progress>
            </li>
            <li>
              <label>jQuery</label>
              <progress value="50" max="100"></progress>
            </li>
            <li>
              <label>Bootstrap</label>
              <progress value="50" max="100"></progress>
            </li>
          </ul>
        </section>
        <!-- </div> -->
      </section>

      <section class="main">
        <!-- 教育经历 -->
        <section class="edu info-unit">
          <h2>
            <i class="fa fa-graduation-cap" aria-hidden="true"></i>教育经历
          </h2>
          <hr />
          <ul>
            <li>
              <h3>
                <span>山东商业职业技术学院 - 生物工程专业（大专）</span>
                <time>2011.09 至 2014.07</time>
              </h3>
            </li>
          </ul>
        </section>

        <!-- 工作经历 -->
        <section class="work info-unit">
          <h2><i class="fa fa-shopping-bag" aria-hidden="true"></i>工作经历</h2>
          <hr />
          <ul>
            <li>
              <h3>
                <span>山东新里程教育信息公司</span>
                <time>2018.11 至 2019.07</time>
              </h3>
              <ul class="info-content">
                <li>职务: <mark>前端工程师</mark></li>
                <li>
                  负责
                  <mark>教学教务管理系统</mark>，<mark>新里程网校</mark>，<mark
                    >小程序</mark
                  >
                  的前端开发工作．
                </li>
              </ul>
            </li>
            <li>
              <h3>
                <span>北京掌贝科技公司</span>
                <time>2017.04 至 2018.10</time>
              </h3>
              <ul class="info-content">
                <li>
                  负责智慧店铺SaaS平台的销售工作和互联网广告产品的推广工作．
                </li>
              </ul>
            </li>
            <li>
              <h3>
                <span>北京宝德龙健康科技有限公司</span>
                <time>2014.10 至 2017.04</time>
              </h3>
              <ul class="info-content">
                <li>主要从事商用健身器材的销售工作.</li>
              </ul>
            </li>
          </ul>
        </section>

        <!-- 项目经验 -->
        <section class="project info-unit">
          <h2><i class="fa fa-bars" aria-hidden="true"></i>项目经验</h2>
          <hr />
          <ul>
            <li>
              <h3>
                <span>教学教务管理系统</span>
              </h3>
              <ul class="info-content">
                <li>前端框架：<mark>Angular 7+</mark></li>
                <li>
                  完成教务系统的前端UI，逻辑交互，功能实现.
                  <br />
                </li>
                <li>
                  使用到的工具：<mark>TypeScript，ng-zorro-antd组件库</mark>
                </li>
              </ul>
            </li>
            <li>
                <h3>
                  <span>新里程网校</span>
                </h3>
                <ul class="info-content">
                  <li>前端工具：<mark>jQuery</mark></li>
                  <li>
                    完成新里程网校 <mark>PC端，手机端</mark><mark>在线考试</mark>模块的开发.
                    <br />
                  </li>
                  <li>
                    使用到的工具：<mark>Bootstrap， Layui</mark>
                  </li>
                </ul>
              </li>
              <li>
                  <h3>
                    <span>新里程网校小程序</span>
                  </h3>
                  <ul class="info-content">
                    <li>
                      使用原生小程序开发<mark>在线考试</mark>模块
                      <br />
                    </li>
                    <li>
                      使用到的工具：<mark>TypeScript，ColorUI样式库</mark>
                    </li>
                  </ul>
                </li>
            <li>
              <h3>
                <span>[学习]React仿写简书网站</span>
              </h3>
              <ul class="info-content">
                <li>
                  技术栈：<mark>React + Redux + React-router + Antd</mark>
                </li>
                <li>
                  学习React全家桶的使用，了解一个前端项目从开发到上线的全过程
                  <br />
                </li>
                <li>
                  完成<mark>公用Header，首页，专题页，详情页，登录页</mark>的开发
                </li>
                <li>
                  学习CSS in JS 的方式编写CSS
                </li>
                <li>
                  使用到的工具：<mark
                    >Axios，Immutable.js，Redux-thunk，Redux
                    DevTools，styled-components，React-transition-group</mark
                  >等
                </li>
                <li>
                  <a href="https://github.com/liufuzz/jianshu" target="_blank">源码地址</a>
                  <!-- <a href="https://gitee.com/liufu9935/jianshu">在线演示</a> -->
                  <br />
                </li>
              </ul>
            </li>
            <li>
              <h3>
                <span>[学习]Vue仿写去哪儿Web WebApp单页应用</span>
              </h3>
              <ul class="info-content">
                <li>技术栈：<mark>Vue2.5 + Vuex + Vue-router</mark></li>
                <li>
                  使用Vue全家桶编写去哪儿网App核心页面，学习组件化，模块化的开发思想
                  <br />
                </li>
                <li>
                  完成<mark>首页，城市选择页，详情页</mark>的开发
                </li>
                <li>
                    使用到的工具：<mark>Axios，Eslint</mark>
                  </li>
                <li>
                  <a href="https://gitee.com/liufu9935/VueTraval" target="_blank">源码地址</a>
                  <br />
                </li>
              </ul>
            </li>
          </ul>
        </section>
        <!-- 其他技能 -->
        <section class="work info-unit">
          <h2><i class="fa fa-terminal" aria-hidden="true"></i>其他技能</h2>
          <hr />
          <ul class="info-content">
            <li>
              熟练使用ES6编程，了解es6新特性
            </li>
            <li>
              了解Python语言， 了解docker容器技术
            </li>
            <li>
              熟悉Linux系统，使用VS Code开发工具
            </li>
            <li>
              熟悉Webpack打包工具，能配置开发环境
            </li>
            <li>
                正在学习flutter,taro框架，尝试多端开发
              </li>
          </ul>
        </section>

        <!-- 自我评价 -->
        <section class="work info-unit">
          <h2><i class="fa fa-pencil" aria-hidden="true"></i>自我评价/期望</h2>
          <hr />
          <p>
            自从一年前进入前端领域，这一年来深切的感受到前端技术的快速发展，看到了自己还在很多方面存在不足，在这个行业是需要不断的学习的，本人也会持续学习前端技术，希望在前端领域能够长足发展．
          </p>
        </section>

        <section class="work info-unit">
          <h2>: )　致谢</h2>
          <hr />
          <p>感谢您花时间来阅读我的简历，期待与您共事！</p>
        </section>
      </section>
    </article>

    <footer class="footer">
      <p>© ２０１9</p>
    </footer>
  </body>
</html>
